<div class="modal" ng-controller="FlowableRolePopupCtrl">
    <div class="modal-dialog">
        <div class="modal-content">
            <div class="modal-header">
                <button type="button" class="close" data-dismiss="modal" aria-hidden="true" ng-click="close()">&times;</button>
                <h2 translate>角色</h2>
            </div>
            <div class="content_wrap" style="margin-top:20px;">
            	<div class="left1">
            		<ul id="roleZtree" class="ztree"></ul>
			    </div>
			    <div class="middle1">
						<div style="height:380px;display:block">
							<span onclick="add();" class="glyphicon glyphicon-plus"></span>
							<span id="gminus" class="glyphicon glyphicon-minus"></span>
							<input id="fuserids" name="fuserids" type="hidden" ng-model="fuserids" />
							<input id="fusernames" name="fusernames" type="hidden" ng-model="fusernames" />
							<input id="liusernames" name="liusernames" type="hidden" />
						</div>
					</div>
				<div class="right1">
			    	<ul id="resultsZtree" class="ztree">
			       	</ul>
			    </div>
            </div>
            <div class="modal-footer">
                <button ng-click="save()" class="btn btn-primary" translate>确定</button>
                <button ng-click="close()" class="btn btn-primary" translate>取消</button>
            </div>
        </div>
    </div>
<script type="text/javascript">
     
     

	var setting = {
		check: {
            enable: true,
            chkboxType:  {"Y": "","N": ""}
        },view: {
			dblClickExpand: dblClickExpand
		},data: {
			simpleData: {
				enable: true
			}
		},callback:{
			onCheck:zTreeOnClick   
		}
	};

    	function dblClickExpand(treeId, treeNode) {
		return treeNode.level > 0;
	}
	function zTreeOnClick(event, treeId, treeNode) {
        var treeObj = jQuery.fn.zTree.getZTreeObj("roleZtree");
        nodes = treeObj.getCheckedNodes(true);
   
        var v1 = "";//id
    	var v2 = "";//name
    	var v3 = "<li style='height:30px;'>名称</li>";//li 右边加入栏里面的写法
        for (var i = 0; i < nodes.length; i++) {
        	if(i==(nodes.length-1)){
        		v1 = v1 + nodes[i].id;
        		v2 = v2 + nodes[i].name;
        	} else {
        		v1 = v1 + nodes[i].id + ",";
                v2 = v2 + nodes[i].name + ",";
        	}
            v3 = v3 +"<li style='height:25px;'>"+ nodes[i].name + "</li>";
        }
        jQuery('#fuserids').val(v1);
		jQuery('#fusernames').val(v2);
		jQuery('#liusernames').val(v3);
    }
	function add(){
		jQuery('#resultsZtree').html("");
		jQuery('#resultsZtree').append(jQuery('#liusernames').val());
	}

function dubRemove(arr){
        let res=[];
        let repeat=[];
        for(let i=0;i<arr.length;i++){
            let name=arr[i].name;
            if(!repeat[name]){
                res.push(arr[i]);
                repeat[name]=1
            }
        }
        return res;
}
let arr=[];

 function unflatten(data) {
    var result = {};
    let obj={}
    function recurse (cur, prop) {
        if (Object(cur) !== cur) {
            result[prop] = cur;
        } else if (Array.isArray(cur)) {
             for(var i=0, l=cur.length; i<l; i++)
                 
                 recurse(cur[i], prop + "[" + i + "]");
            if (l == 0)
                result[prop] = [];
        } else {
            var isEmpty = true;
            for (var p in cur) {
                isEmpty = false;
                if(cur.roleGroupName){
                    obj={id:cur.id,name:cur.roleGroupName,pId:0,open:true}
                }else{
                    obj={id:cur.id,name:cur.roleNameZh,pId:cur.groupId}
                }
                
                arr.push(obj);
              
                recurse(cur[p], prop ? prop+"."+p : p);
            }
            if (isEmpty && prop)
                result[prop] = {};
        }
    }
    recurse(data, "");
    return arr;
}



	jQuery(document).ready(function(){

        jQuery.ajax({ 
                type: "GET",
                dataType: "json",
                url: "/dev-api/scene/role/list-by-scene?sceneId=e65edc60-96ee-11e9-ac96-005056c00001&&page=1&&size=10",
                headers:{
                    "authorization":token
                 },
                success: function(result){
                	 jQuery.fn.zTree.init(jQuery("#roleZtree"),setting,dubRemove(unflatten(result.data.list)));
                },
                error:function(err){
                    console.log(err)
                }
            });
  

 jQuery('#resultsZtree').append("<li style='height:30px;'>名称</li>");
	});
</script>